<template>
  <div style="margin: 20px;">
    <el-dialog title="发票打印" :visible.sync="dialogFormVisible" style="float:left">
      
      <el-form :model="invoiceForm" style="margin-top:20px">
        <el-form-item label="发票号" :label-width="formLabelWidth">
          <el-input style="width:80%" v-model="invoiceForm.invoiceId" autocomplete="off" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="项目名" :label-width="formLabelWidth">
          <el-input style="width:80%" v-model="invoiceForm.proName" autocomplete="off" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="单价" :label-width="formLabelWidth">
          <el-input style="width:80%" v-model="invoiceForm.sinPrice" autocomplete="off" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="数量" :label-width="formLabelWidth">
          <el-input style="width:80%" v-model="invoiceForm.num" autocomplete="off" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="金额" :label-width="formLabelWidth">
          <el-input style="width:80%" v-model="invoiceForm.expense" autocomplete="off" :disabled="true"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="registerInvoice()">打印</el-button>
      </div>
      
    </el-dialog>




    <el-container>
        <el-header >


          <span style="font-size:60px">现场挂号</span>
          <el-link type="primary" href="/#/initMain" style="float:right"><b>返回首页</b></el-link>
        </el-header>
        <el-main>
          <el-form :model="getNumForm" :rules="rules" ref="getNumForm" label-width="60px" class="demo-ruleForm">
            <el-row >
              <el-col span="8">
                <el-form-item label="病历号" prop="patientId" >
                <el-input v-model="getNumForm.patientId" :disabled='true' placeholder="系统自动生成"></el-input>
                </el-form-item>
              </el-col>
                <el-col span="8">
                <el-form-item label="姓名" prop="name" >
                  <el-input v-model="getNumForm.name" placeholder="请输入姓名"></el-input>
                </el-form-item>
              </el-col>

            </el-row>

            <el-row >
              <el-col span="8">
                <el-form-item label="性别" prop="gender"  >
                  <el-radio-group v-model="getNumForm.gender">
                    <el-radio label="男"></el-radio>
                    <el-radio label="女"></el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col span="8">
                <el-form-item label="年龄" prop="age">
                  <el-input v-model="getNumForm.age" placeholder="年龄或出生日期填一个"></el-input>
                </el-form-item>
              </el-col>
              <el-col span="8">
                <el-form-item label="出生日期" required>
                  <el-form-item prop="birthday">
                    <el-date-picker type="date" placeholder="选择日期" v-model="getNumForm.birthday" style="width: 100%;"></el-date-picker>
                  </el-form-item>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col span="8">
                <el-form-item label="身份证号" prop="personId">
                  <el-input v-model="getNumForm.personId" placeholder="请输入身份证号"></el-input>
                </el-form-item>
              </el-col>
              <el-col span="8">
                <el-form-item label="家庭住址" prop="address"  >
                  <el-input v-model="getNumForm.address" placeholder="请输入家庭住址"></el-input>
                </el-form-item>
              </el-col>
            </el-row>




            <el-row>
              <el-col span="8">
                <el-form-item label="挂号级别" prop="registerLevel" >
                  <el-select v-model="getNumForm.registerLevel" placeholder="请选择挂号级别">
                  
                  <!-- <el-option label="急诊号" value="hurry"></el-option>
                    <el-option label="专家号" value="professional"></el-option>
                    <el-option label="普通号" value="ordinary"></el-option> -->
                  <el-option v-for="level in levels" 
                :key="level.levelId" :label="level.levelName" 
                :value="level.levelId" >
                  </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col span="8">
              <el-form-item label="科室" prop="room">
                <el-select v-model="getNumForm.room" placeholder="请选择挂号科室">
                  <!--<el-option label="呼吸内科" value="breath"></el-option>
                  <el-option label="眼科" value="eye"></el-option>
                  <el-option label="耳鼻喉" value="earNose"></el-option>
                  <el-option label="皮肤科" value="skin"></el-option>
-->
                <el-option v-for="ro in rooms" 
                :key="ro.roomId" :label="ro.roomName" 
                :value="ro.roomId">
                </el-option>
              </el-select>

              </el-form-item>
              </el-col>
              <el-col span="8">
              <el-form-item label="医生" prop="doctor">
                <el-select v-model="getNumForm.doctor" placeholder="请选择看诊医生">
                  <!--<el-option label="张三" value="zhangsan"></el-option>
                  <el-option label="李四" value="lisi"></el-option>
                  <el-option label="王五" value="wangwu"></el-option>-->
                  <el-option v-for="doc in doctors" :label="doc.name"
                  :value="doc.doctorId" :key="doc.doctorId">
                    
                  </el-option>
                </el-select>
              </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col span="8">
              <el-form-item label="是否需要病历本" prop="document">
                <el-radio-group v-model="getNumForm.document">
                  <el-radio label=1>是</el-radio>
                  <el-radio label=0>否</el-radio>
                </el-radio-group>
              </el-form-item>
              </el-col>
              <el-col span="8">
                <el-form-item label="结算类型" prop="payType"  >
                <el-select v-model="getNumForm.payType" placeholder="请选择结算类型">
                  <!--<el-option label="现金" value="cash"></el-option>
                  <el-option label="网银" value="online"></el-option>-->
                  <el-option v-for="payType in payTypes" 
                  :label="payType.payTypeName" :value="payType.payTypeId"
                   :key="payType.patTypeId">
                  </el-option>
                </el-select>
              </el-form-item>
              </el-col>
            </el-row>
            <hr/>
            <el-col span="8">
              <el-form-item label="金额" prop="cost">
                <el-input v-model="getNumForm.cost" :disabled="true" placeholder="系统自动算出"></el-input>
              </el-form-item>
            </el-col>

            <el-form-item>
              <el-button type="primary" @click="submitForm()">挂号</el-button>
              <el-button @click="resetForm('getNumForm')">清空</el-button>
            </el-form-item>
          </el-form>
        </el-main>
    </el-container>
  </div>

</template>
<style>
  .el-header {
    /*background-color: #B3C0D1;*/
    background-color: #B3C0D1;
    color: #333;
    line-height: 60px;

  }
</style>

<script>
import axios from 'axios';
  export default {
    data() {
      return {
        dialogFormVisible:false,
        formLabelWidth:'120px',
        baseExpense:0,
        getNumForm: {
          patientId: '',
          name: '',
          gender: '',
          age: '',
          birthday:'',
          personId: '',
          address:'',
          payType: '',
          registerLevel:'',
          room:'',
          doctor:'',
          document:'',
          
          cost:0

        },
        invoiceForm:{
          invoiceId:'',
          proName:'挂号',
          sinPrice:0,
          num:1,
          expense:0,
        },
        levels:[
          {levelName:'急诊号',levelId:1,levelPrice:30},
          {levelName:'专家号',levelId:2,levelPrice:20},
          {levelName:'普通号',levelId:3,levelPrice:13}
        ],
        rooms:[
          {roomName:'眼科',roomId:'001'},
          {roomName:'耳鼻喉',roomId:'002'},
          {roomName:'神经内科',roomId:'003'}
        ],
        doctors:[
          {name:"张三",doctorId:'123'},
          {name:'李四',doctorId:'234'}
        ],
        payTypes:[
          {payTypeName:'现金',payTypeId:1},
          {payTypeName:'网银',payTypeId:2},
        ],
        rules: {
          name: [
            { required: true, message: '请输入姓名', trigger: 'blur' },
            { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
          ],
           gender: [
            { required: true, message: '请选择性别', trigger: 'blur' }
          ],
          age: [
            { required: true, message: '请选填年龄或出生日期之一', trigger: 'blur' }
          ],
          bitrhday: [
            { type: 'date', required: true, message: '请选择出生日期', trigger: 'change' }
          ],
        /* personId: [
            { required: true, message: '请输入身份证号', trigger: 'blur' }
          ],
          address: [
            { required: true, message: '请输入家庭住址', trigger: 'blur' }
          ],*/
          payType: [
            { required: true, message: '请输入支付类型', trigger: 'change' }
          ],
          registerLevel: [
            { required: true, message: '请选择挂号级别', trigger: 'change' }
          ],
          room: [
            { required: true, message: '请选择科室', trigger: 'change' }
          ],
          doctor: [
            { required: true, message: '请选择看诊医生', trigger: 'change' }
          ],
          document: [
            { required: true, message: '请选择是否需要病本', trigger: 'change' }
          ],
        }
      };
    },
  created:function(){
      //自动生成病历号
      this.initPatientId();
  },
  watch:{
    registerLevel: function (newV, oldV) {
      /*this.answer = 'Waiting for you to stop typing...'
      this.debouncedGetAnswer()*/
      this.baseExpense+=this.levels[newV].levelPrice;
      this.getNumForm.cost=this.baseExpense;
    },
    document:function(newV, oldV){
      if(newV==1){
        this.getNumForm.cost=this.baseExpense+1;
      }
      if(newV==0){
        this.getNumForm.cost=this.baseExpense;
        
      }
    }

  },
  methods: {
     initPatientId(){
       this.getNumForm.patientId=new Date().getTime();
     },
      submitForm(){
        this.dialogFormVisible=true;
        
        this.invoiceForm.invoiceId=new Date().getTime();
          this.invoiceForm.proName='挂号';
          this.invoiceForm.sinPrice=this.getNumForm.cost;
          this.invoiceForm.num=1;
          this.invoiceForm.expense=this.getNumForm.cost;
      },
      registerInvoice() {
        //this.$refs[formName].validate((valid) => {
          //if (valid) {
            //alert('submit!');
            //var fm=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date());
            var member=JSON.stringify({
              patientId:this.getNumForm.patientId,
              name:this.getNumForm.name,
              gender:this.getNumForm.gender,
              age:this.getNumForm.age,
              birthday:this.getNumForm.birthday,
              identified:this.getNumForm.personId,
              address:this.getNumForm.address,
              payTypeId:this.getNumForm.payType,
              registerLeverId:this.getNumForm.registerLevel,
              roomId: this.getNumForm.room,
              doctorId: this.getNumForm.doctor,
              isUseDoc:this.getNumForm.document,
              registerTime:new Date(), //new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date()),
              stateId:0,
              cost:this.getNumForm.cost,
            });
    console.log(member);
      axios
        .post("/api/reception/addMember",member,{
          headers:{"Content-Type":"application/json;charset=utf-8"}
        })
        .then(res => {
                console.log(res.data);
                /*if(data=="1"){
                  this.$message({
                    message:'增加成功',
                    type:'success',
                    showClose:true
                    
                  })
                }else{
                  this.$message({
                    message:'增加失败',
                    type:'warn',
                    showClose:false
                });}*/
                var invoice=JSON.stringify({
                invoiceId:this.invoiceForm.invoiceId,
                invoiceDatetime:new Date,
                payTypeId:this.getNumForm.payType,
                isLegal:1,
                printTimes:1,
                });
              console.log(invoice);
              axios
              .post("/api/reception/registerInvoice",invoice,{
                headers:{"Content-Type":"application/json;charset=utf-8"}
                /*// params :{
                //   ppk:patiProKey,
                //   pp:patPro
                // }*/
            })
                .then(res => {
                        console.log(res.data);
                        var patiPro=JSON.stringify({
                        patientId:this.getNumForm.patientId,
                        projectName:this.invoiceForm.proName,
                        invoiceId:this.invoiceForm.invoiceId,
                        projectNum:this.invoiceForm.num,
                        projectDatetime:new Date(),//new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date()) ,

                      });
                      console.log(patiPro);
                      axios
                      .post("/api/reception/registerPatiPro",patiPro,{
                        headers:{"Content-Type":"application/json;charset=utf-8"}
                        /*// params :{
                        //   ppk:patiProKey,
                        //   pp:patPro
                        // }*/
                      })
                      .then(res => {
                        console.log(res.data);
                        })
                      .catch(function(error) {
                        console.log(error);
                      });

                this.dialogFormVisible=false;
                this.resetForm('getNumForm');
            //initPatientId();
                })
                .catch(function(error) {
                console.log(error);
                });
        }).catch(function(error) {
          console.log(error);
      });
        
        
    },
      resetForm(formName) {
        this.$refs[formName].resetFields();
        this.initPatientId();
      }
    }
  }
</script>

